<template>
  <div id='store-holder'>
    <store-header></store-header>
    <store-productlist :products="products"></store-productlist>
    <shopping-cart></shopping-cart>
  </div>
</template>

<script>
// import { ROUTENAME } from 'services/constConfig.js'
import { mapGetters, mapActions } from 'vuex'
import StoreHeader from 'components/Header.vue'
import StoreProductList from 'components/StoreProductList.vue'
import ShoppingCart from 'components/ShoppingCart.vue'
import productService from 'services/productService.js'
import * as notifyUtil from 'utils/notifyUtil.js'

export default {
  components: {
    'store-header': StoreHeader,
    'store-productlist': StoreProductList,
    'shopping-cart': ShoppingCart
  },
  data() {
    return {
      products: []
    }
  },
  computed: mapGetters({
    nowStore: 'nowStore'
  }),
  methods: {
    ...mapActions({
      setNowStore: 'setNowStore'
    }),
    getProductsByStoreId() {
      productService.getProductsByShopId(this.nowStore.id).then(response => {
        if (
          response.data.Product === null ||
          response.data.Product === undefined
        ) {
          notifyUtil.showError('查找商品失败', '该商店暂未上架商品')
        } else {
          let products = response.data.Product
          this.$set(this, 'products', products)
        }
      })
    }
  },
  mounted() {
    this.getProductsByStoreId()
  },
  watch: {}
}
</script>

<style scoped>

</style>
